$(function () {
    // 默认加载部门树
    vm.getDept();
    // 初始化设备状态
    $("#jqGrid").Grid({
        url: '../devstatushistoryrecord/list',
        rownumWidth: 40,
        autowidth: false,
        multiselect: false,
        datatype: 'local',
        colModel: [
            {label: '设备状态', name: 'devStatusDesc', index: 'DEVSTATUS', width: 120},
            {label: '持续开始时间', name: 'startDate', index: 'START_DATE'},
            {label: '持续结束时间', name: 'endDate', index: 'END_DATE'},
            {label: '持续时长(S)', name: 'duration', index: 'DURATION', width: 120},
        ]
    });
});
var ztree;
//部门树
var deptSetting = {
    data: {
        simpleData: {
            enable: true,
            idKey: "deptId",
            pIdKey: "parentId",
            rootPId: '01'
        },
        key: {
            url: "nourl",
            name: "complexName" //name 与 typeName 绑定
        },
    },
    callback: {
        onClick: outTreeCheck
    }
};

function outTreeCheck(e, treeObj, treeNode) {
    //此处treeNode 为当前节点
    vm.q.curDeptId = treeNode.deptId;
    if (treeNode.deptLevel == 4) {
        vm.isProcess = true;
        // 加载工序下设备列表
        vm.loadProcessDev(treeNode.parentCode, treeNode.dcode);
    } else {
        vm.isProcess = false;
    }
    // 执行查询
    vm.search();
}

var myChart;
var vm = new Vue({
    el: '#rrapp',
    data: {
        isProcess: false, // 是否是工序
        deviceInfoList: [],
        q: {
            curDeptId: '', // 所属车间地点ID
            devCode: '', // 设备编码
            startDate: '', // 统计开始日期
            endDate: '' // 统计结束日期
        },
        orderFields: [
            {name: '报警频次TOP显示', value: 'alarm'}, {name: '维修频次TOP显示', value: 'repair'}
        ],
        option: {
            color: ['#6ec56f', '#f8e567', '#a5a5a5', '#f10606', '#4472c4', '#6ec56f'],
            title: {
                text: '设备状态数量分布统计',
                left: 'center'
            },
            tooltip: {
                trigger: 'item',
                formatter: '{b}: {c} ({d}%)'
            },
            legend: {
                data: ['运行', '空闲', '停机', '未知'],
                orient: 'vertical',
                right: 20
            },
            labelLine: {
                show: false
            },
            series: [
                {
                    type: 'pie',
                    radius: '65%',
                    center: ['50%', '50%'],
                    selectedMode: 'single',
                    data: [
                        {value: 335, name: '运行'},
                        {value: 310, name: '空闲'},
                        {value: 234, name: '停机'},
                        {value: 135, name: '未知'}]
                }
            ]
        }
    },
    methods: {
        loadProcessDev: function (lineCode, devProceNo) {
            // 加载工序下设备
            //加载部门树
            Ajax.request({
                url: '../deviceinfo/loadProcessDev',
                params: {devProductCode: lineCode, devProceNo: devProceNo},
                async: false,
                successCallback: function (r) {
                    vm.deviceInfoList = r.deviceInfoList;
                    if (vm.deviceInfoList.length > 0) {
                        vm.q.devCode = vm.deviceInfoList[0].devCode;
                        vm.query();
                    }
                }
            });
        },
        getDept: function () {
            //加载部门树
            Ajax.request({
                url: '../sys/user/treeDeptBySCX',
                async: false,
                successCallback: function (r) {
                    ztree = $.fn.zTree.init($("#deptTree"), deptSetting, r.list);

                    var node = ztree.getNodeByParam("deptId", '01');
                    if (node != null) {
                        vm.q.curDeptId = node.deptId;
                        ztree.selectNode(node);
                        ztree.expandNode(node);
                    } else {
                        ztree.expandAll(true);
                    }
                    // 执行查询
                    vm.search();
                }
            });
        },
        convertGMT2Date: function (time) {
            var date = new Date(time)
            var month = (date.getMonth() + 1);
            return date.getFullYear() + '-' + (month < 10 ? '0' : '') + month + '-' + date.getDate();
        },
        query: function () {
            // 创建查询参数
            var postParam = {};
            if (vm.q.devCode) {
                postParam.devCode = vm.q.devCode
            }
            if (vm.q.startDate) {
                postParam.startDate = vm.convertGMT2Date(vm.q.startDate) + ' 0:00:00';
            }
            if (vm.q.endDate) {
                postParam.endDate = vm.convertGMT2Date(vm.q.endDate) + ' 23:59:59';
            }
            // 清空postData缓存数据
            var postData = $("#jqGrid").jqGrid("getGridParam", "postData");
            $.each(postData, function (k, v) {
                delete postData[k];
            });
            var page = $("#jqGrid").jqGrid('getGridParam', 'page');
            $("#jqGrid").jqGrid('setGridParam', {
                search: true,
                datatype: 'json',
                postData: postParam,
                page: page
            }).trigger("reloadGrid");
        },
        reset: function () {
            vm.q = {
                curDeptId: '', // 所属车间地点ID
                startDate: '', // 统计开始日期
                endDate: '' // 统计结束日期
            }
            if (vm.deviceInfoList.length > 0) {
                vm.q.devCode = vm.deviceInfoList[0].devCode;
                vm.query();
            }
        },
        search: function () {
            var param = {};
            if (vm.q.curDeptId) {
                param.curDeptId = vm.q.curDeptId;
            }
            myChart.showLoading();
            Ajax.request({
                url: "../device/stat/status",
                params: JSON.stringify(param),
                type: "POST",
                contentType: "application/json",
                successCallback: function (res) {
                    myChart.hideLoading();
                    var option = {
                        title: {
                            subtext: ''
                        },
                        series: {
                            data: res.devStatusStat.seriesData
                        },
                        legend: {
                            data: res.devStatusStat.legendData
                        }
                    };

                    if (res.devStatusStat.seriesData.length == 0) {
                        option.title.subtext = '当前组织下暂无设备信息';
                    }
                    myChart.setOption(option);
                }
            });
        },
        GMTToStr: function (time) {
            var date = new Date(time)
            var month = date.getMonth() + 1;
            return date.getFullYear() + '-' + (month < 10 ? '0' : '') + month;
        }
    },
    mounted: function () {
        // 初始化部门树
        myChart = echarts.init(document.getElementById("container"));
        myChart.setOption(this.option, true)  //setOption 用this.option中的数据开始作图
    }
});
